<template>
  <el-dialog
    v-model="visible"
    class="component-coupon-add-or-update"
    :title="dataForm.couponId ? $t('coupon.modifyCoupon') : $t('coupon.newCoupon')"
    :close-on-click-modal="false"
    :before-close="beforeClose"
  >
    <el-form
      v-if="show"
      ref="dataFormRef"
      :model="dataForm"
      :rules="dataRule"
      :label-width="$t('language') === 'language' ? '170px' : '100px'"
      @submit.prevent
      @keyup.enter="onSubmit()"
    >
      <el-form-item
        :label="$t('coupon.couponName')"
        prop="couponName"
      >
        <el-input
          v-model.trim="dataForm.couponName"
          :placeholder="$t('coupon.couponName')"
          maxlength="20"
          show-word-limit
          :disabled="dataForm.couponId !== 0"
        />
      </el-form-item>
      <el-form-item
        :label="$t('coupon.deliveryStatus')"
        prop="putonStatus"
      >
        <el-radio-group
          v-model="dataForm.putonStatus"
          :disabled="dataForm.putonStatus < 0"
        >
          <el-radio :label="0">
            {{ $t("coupon.waitAutoLaunch") }}
            <el-tooltip
              class="item"
              effect="light"
              placement="top"
            >
              <template #content>
                <div>
                  {{ $t("coupon.launchTip") }}
                </div>
              </template>
              <span>
                <el-icon><QuestionFilled /></el-icon>
              </span>
            </el-tooltip>
          </el-radio>
          <el-radio :label="1">
            {{ $t("coupon.launched") }}
          </el-radio>
          <el-radio :label="4">
            {{ $t("coupon.waitLaunch") }}
          </el-radio>
          <el-radio
            :disabled="true"
            :label="-1"
          >
            {{ $t("coupon.cancelLaunch") }}
            <el-tooltip
              class="item"
              effect="light"
              placement="top"
            >
              <template #content>
                <div>
                  {{ $t("coupon.launchTip1") }}
                </div>
              </template>
              <span>
                <el-icon><QuestionFilled /></el-icon>
              </span>
            </el-tooltip>
          </el-radio>
        </el-radio-group>
      </el-form-item>
      <!-- 投放时间 -->
      <el-form-item
        v-if="dataForm.putonStatus === 0"
        :label="$t('coupon.timeToMarket')"
        prop="launchTime"
      >
        <el-date-picker
          v-model="dataForm.launchTime"
          value-format="YYYY-MM-DD"
          type="date"
          style="width:140px"
          :placeholder="$t('coupon.chooseLaunchTime')"
        />
        <el-time-select
          v-model="launchTimeValue"
          :start="'00:00'"
          :step="'00:30'"
          :end="'23:30'"

          style="width:110px"
          :placeholder="$t('coupon.startTime')"
        />
      </el-form-item>
      <el-form-item
        :label="$t('coupon.getWay')"
        prop="getWay"
      >
        <el-radio-group v-model="dataForm.getWay">
          <el-radio :label="0">
            {{ $t("coupon.receiveDirectly") }}
          </el-radio>
          <el-radio :label="1">
            {{ $t("coupon.exchangeOrSystemIssue") }}
            <el-tooltip
              class="item"
              effect="light"
              placement="top"
            >
              <template #content>
                <div>
                  {{ $t("coupon.getWayTip") }}
                </div>
              </template>
              <span>
                <el-icon><QuestionFilled /></el-icon>
              </span>
            </el-tooltip>
          </el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item
        :label="$t('coupon.couponType')"
        prop="couponType"
      >
        <el-radio-group
          v-model="dataForm.couponType"
          :disabled="dataForm.couponId !== 0"
        >
          <el-radio :label="1">
            {{ $t("coupon.cashCoupon") }}
          </el-radio>
          <el-radio :label="2">
            {{ $t("coupon.discountVoucher") }}
          </el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item
        :label="$t('coupon.conditionsOfUse')"
        prop="cashCondition"
      >
        {{ $t('coupon.spendMoreThan') }}
        <el-input
          v-model="dataForm.cashCondition"
          :placeholder="$t('coupon.conditionsOfUse')"
          type="number"
          min="0"
          :disabled="dataForm.couponId !== 0"
          @change="cashConditionChange"
        >
          <template #append>
            {{ $t('coupon.yuan') }}
          </template>
        </el-input>
      </el-form-item>
      <el-form-item
        v-if="dataForm.couponType === 1"
        :label="$t('coupon.reductionAmount')"
        prop="reduceAmount"
      >
        <el-input
          v-model="dataForm.reduceAmount"
          :placeholder="$t('coupon.reductionAmount')"
          type="number"
          :disabled="dataForm.couponId !== 0"
          :min="0.01"
          :max="99999"
          @change="checkNumber(1)"
        >
          <template #append>
            {{ $t("coupon.yuan") }}
          </template>
        </el-input>
      </el-form-item>
      <el-form-item
        v-if="dataForm.couponType === 2"
        :label="$t('coupon.discountAmount')"
        prop="couponDiscount"
      >
        <el-input
          v-model="dataForm.couponDiscount"
          :placeholder="$t('coupon.discountAmount')"
          type="number"
          :disabled="dataForm.couponId !== 0"
          min="0"
          @change="checkNumber(2)"
        >
          <template #append>
            {{ $t("coupon.off") }}
          </template>
        </el-input>
      </el-form-item>
      <!-- 生效时间 -->
      <el-form-item
        :label="$t('coupon.effectiveType')"
        prop="validTimeType"
      >
        <el-radio-group
          v-model="dataForm.validTimeType"
          :disabled="dataForm.couponId !== 0"
        >
          <el-radio :label="1">
            {{ $t("coupon.fixedTime") }}
          </el-radio>
          <el-radio :label="2">
            {{ $t("coupon.effectiveAfterReceiving") }}
          </el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item
        v-if="dataForm.validTimeType === 1"
        :label="$t('coupon.startTime')"
        prop="startTime"
      >
        <el-date-picker
          v-model="dataForm.startTime"
          :disabled="dataForm.couponId !== 0"
          value-format="YYYY-MM-DD"
          type="date"

          style="width:140px"
          :placeholder="$t('marketing.chooseStartTime')"
        />
        <el-time-select
          v-model="startTimeValue"
          :start="'00:00'"
          :step="'00:30'"
          :end="'23:30'"

          style="width:110px"
          :disabled="dataForm.couponId !== 0"
          :placeholder="$t('coupon.startTime')"
          @blur="handleValidate('startTime')"
        />
      </el-form-item>
      <el-form-item
        v-if="dataForm.validTimeType === 1"
        :label="$t('coupon.endTime')"
        prop="endTime"
      >
        <el-date-picker
          v-model="dataForm.endTime"
          value-format="YYYY-MM-DD"
          type="date"
          style="width:140px"
          :placeholder="$t('marketing.chooseEndTime')"
        />
        <el-time-select
          v-model="endTimeValue"
          :start="'00:00'"
          :step="'00:30'"
          :end="'23:30'"
          style="width:110px"
          :placeholder="$t('coupon.endTime')"
          @blur="handleValidate('endTime')"
        />
      </el-form-item>
      <el-form-item
        v-if="dataForm.validTimeType === 2"
        :label="$t('coupon.AfterReceipt')"
        prop="afterReceiveDays"
      >
        <el-input
          v-model="dataForm.afterReceiveDays"
          type="number"
          style="width: 300px"
          oninput="if(value>3652)value=1"
          :max="3652"
          :disabled="dataForm.couponId !== 0"
        >
          <template #append>
            {{ $t("marketing.effectiveDays") }}
          </template>
        </el-input>
        <el-tooltip
          class="item"
          effect="dark"
          :content="$t('marketing.maxTimeTip')"
          placement="top"
        >
          <el-icon><InfoFilled /></el-icon>
        </el-tooltip>
      </el-form-item>
      <el-form-item
        v-if="dataForm.validTimeType === 2"
        :label="$t('coupon.validDate')"
        prop="validDays"
      >
        <el-input
          v-model.number="dataForm.validDays"
          type="number"
          style="width: 300px"
          oninput="if(value>3652)value=1"
          :max="3652"
          :disabled="dataForm.couponId !== 0"
        >
          <template #append>
            {{ $t("coupon.day") }}
          </template>
        </el-input>
        <el-tooltip
          class="item"
          effect="dark"
          :content="$t('marketing.maxTimeTip')"
          placement="top"
        >
          <el-icon><InfoFilled /></el-icon>
        </el-tooltip>
      </el-form-item>
      <el-form-item
        :label="$t('coupon.restrictionsPerPerson')"
        prop="limitNum"
      >
        <el-input
          v-model="dataForm.limitNum"
          type="number"
          min="1"
          max="1000000000"
          @change="limitNumCheck"
        >
          <template #append>
            {{ $t("coupon.sheet") }}
          </template>
        </el-input>
      </el-form-item>
      <el-form-item
        :label="$t('coupon.stock')"
        prop="stocks"
      >
        <el-input
          v-model="dataForm.stocks"
          type="number"
          min="1"
          max="1000000000"
          :disabled="dataForm.couponId !== 0"
          @change="stocksCheck"
        >
          <template #append>
            {{ $t("coupon.sheet") }}
          </template>
        </el-input>
      </el-form-item>
      <el-form-item
        :label="$t('coupon.applicableGoods')"
        prop="suitableProdType"
      >
        <el-radio-group v-model="dataForm.suitableProdType">
          <el-radio :label="0">
            {{ $t("coupon.allProductsParticipate") }}
          </el-radio>
          <el-radio :label="1">
            {{ $t("coupon.participateInDesignatedProd") }}
          </el-radio>
          <el-radio :label="2">
            {{ $t("coupon.specifiedProductsDoNotParticipate") }}
          </el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item>
        <div
          v-if="dataForm.suitableProdType === 1 || dataForm.suitableProdType === 2"
          class="default-btn"
          @click="prodsSelectHandle()"
        >
          {{ $t("coupon.selectGoods") }}
        </div>
      </el-form-item>
      <!-- 商品 -->
      <el-form-item
        v-if="dataForm.suitableProdType !== 0"
        style="width:100%"
      >
        <el-row>
          <div />
          <el-col
            v-for="(couponProd, index) in dataForm.couponProds"
            :key="index"
          >
            <el-card
              :body-style="{ padding: '0px' }"
              style="height: 160px;width: 120px"
            >
              <prod-pic
                height="104px"
                width="100%"
                :pic="couponProd.pic"
              />
              <div class="card-prod-bottom prod-line-height">
                <span class="card-prod-name">{{ couponProd.prodName }}</span>
                <div class="delete-prod">
                  <div
                    class="default-btn text-btn prod-text-left"
                    @click="deleteProd(index)"
                  >
                    {{ $t("coupon.delete") }}
                  </div>
                </div>
              </div>
            </el-card>
          </el-col>
        </el-row>
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <div
          class="default-btn"
          @click="show = false;visible = false"
        >
          {{ $t("coupon.cancel") }}
        </div>
        <div
          class="default-btn primary-btn"
          @click="onSubmit()"
        >
          {{ $t("coupon.confirm") }}
        </div>
      </div>
    </template>
    <!-- 商品选择弹窗-->
    <prods-reserve-selection
      v-if="prodsSelectVisible"
      ref="prodsSelectRef"
      @refresh-select-prods="selectCouponProds"
    />
  </el-dialog>
</template>

<script setup>
import { ElMessage } from 'element-plus'
import { getDateTimeRange, getParseTime } from '@/utils/datetime'

const emit = defineEmits(['refreshDataList'])

const show = ref(true)
const visible = ref(false)
const dataForm = ref({
  couponId: 0,
  couponName: '',
  subTitle: '',
  couponType: 1,
  reduceAmount: 0,
  couponDiscount: 0,
  cashCondition: 0,
  validTimeType: 1,
  getWay: 0,
  launchTime: null,
  startTime: null,
  endTime: null,
  afterReceiveDays: 0,
  validDays: 1,
  stocks: 1,
  suitableProdType: 0,
  limitNum: 1,
  putonStatus: 0,
  couponProds: []
})
const isSubmit = ref(false)
const page = reactive({
  total: 0, // 总页数
  currentPage: 1, // 当前页数
  pageSize: 10 // 每页显示多少条
})
const putonStatus = ref(0)
const errorTip = ref(false)
const prodsSelectVisible = ref(false)

const validate = (rule, value, callback) => {
  if (!/^[1-9]\d*$|^[1-9]\d*\.\d\d?$|^0\.\d\d?$/.test(Number(value))) {
    callback(new Error($t('coupon.pleaseThan0')))
  } else {
    callback()
  }
}
const stockValidate = (rule, value, callback) => {
  if (!/^[1-9]\d*$|^[1-9]\d*\.\d\d?$|^0\.\d\d?$/.test(value) && dataForm.value.couponId === 0) {
    callback(new Error($t('coupon.pleaseThan0')))
  } else {
    callback()
  }
}
const discountValidate = (rule, value, callback) => {
  if (!/^[1-9]\d*$|^[1-9]\d*\.\d\d?$|^0\.\d\d?$/.test(Number(value))) {
    callback(new Error($t('coupon.discountValidate')))
  } else if (parseInt(value) >= 10 || parseInt(value) < 0) {
    callback(new Error($t('coupon.discountValidate')))
  } else {
    callback()
  }
}
// eslint-disable-next-line no-unused-vars
const validateTime = (rule, value, callback) => {
  if (rule.field === 'startTime' && (!startTimeValue.value || !dataForm.value.startTime)) {
    callback(new Error($t('formData.startTimeCannotBeEmpty')))
  }
  if (rule.field === 'endTime' && (!endTimeValue.value || !dataForm.value.endTime)) {
    callback(new Error($t('formData.endTimeCannotBeEmpty')))
  }
  const startTime = dataForm.value.startTime + ' ' + startTimeValue.value + ':00'
  const endTime = dataForm.value.endTime + ' ' + endTimeValue.value + ':00'
  if (rule.field === 'startTime' && Date.parse(startTime) >= Date.parse(endTime)) {
    callback(new Error($t('coupon.validateTime')))
  }
  if (rule.field === 'endTime' && new Date() > Date.parse(endTime)) {
    callback(new Error($t('coupon.endTimeLimit')))
  } else {
    callback()
  }
}

const dataRule = reactive({
  couponName: [
    { required: true, message: $t('coupon.couponNameCannotBeEmpty'), trigger: 'blur' }
  ],
  launchTime: [
    { required: true, message: $t('coupon.launchTimeTip1'), trigger: 'blur' }
  ],
  couponType: [
    { required: true, message: $t('coupon.couponTypeNotEmpty'), trigger: 'blur' }
  ],
  reduceAmount: [
    { required: true, message: $t('coupon.theDedEmpty'), trigger: 'blur' },
    { validator: validate, trigger: 'blur' }
  ],
  couponDiscount: [
    { required: true, message: $t('coupon.theDiscouBeEmpty'), trigger: 'blur' },
    { validator: discountValidate, trigger: 'blur' }
  ],
  startTime: [
    { required: true, message: $t('coupon.startTimeCannotBeEmpty'), trigger: 'blur' },
    { validator: validateTime, trigger: 'blur' }
  ],
  endTime: [
    { required: true, message: $t('coupon.endTimeCannotBeEmpty'), trigger: 'blur' },
    { validator: validateTime, trigger: 'blur' }
  ],
  afterReceiveDays: [
    { required: true, message: $t('coupon.timeCannotBeEmpty'), trigger: 'blur' }
  ],
  validDays: [
    { required: true, message: $t('coupon.timeCannotBeEmpty'), trigger: 'blur' },
    { type: 'number', min: 1, message: $t('coupon.validDaysAlert'), trigger: 'blur' }
  ],
  cashCondition: [
    { required: true, message: $t('coupon.conditionBeEmpty'), trigger: 'blur' },
    { validator: validate, trigger: 'blur' }
  ],
  validTimeType: [
    { required: true, message: $t('coupon.effectiveotBeEmpty'), trigger: 'blur' }
  ],
  stocks: [
    { required: true, message: $t('coupon.invenEmpty'), trigger: 'blur' },
    { validator: stockValidate, trigger: 'blur' }
  ],
  suitableProdType: [
    { required: true, message: $t('coupon.applicabltBeEmpty'), trigger: 'blur' }
  ]
})
const launchTimeValue = ref('')
const startTimeValue = ref('')
const endTimeValue = ref('')
const dataFormRef = ref(null)

watch(
  () => visible.value,
  () => {
    if (visible.value === false) {
      prodsSelectVisible.value = false
    }
  }
)

/**
 * 获取数据列表
 * @param couponId
 */
const init = (couponId) => {
  show.value = true
  dataForm.value.couponId = couponId || 0
  putonStatus.value = 0
  visible.value = true
  isSubmit.value = false
  if (!couponId) { // 每次新增时  初始化表单数据
    initDataForm()
    const datetimeRange = getDateTimeRange()
    dataForm.value.launchTime = datetimeRange.startTime
    dataForm.value.startTime = datetimeRange.startTime
    dataForm.value.endTime = datetimeRange.endTime
    launchTimeValue.value = datetimeRange.currentTime
    startTimeValue.value = datetimeRange.currentTime
    endTimeValue.value = datetimeRange.currentTime
  }
  if (dataForm.value.couponId) {
    getDataList()
  }
}
defineExpose({ init })

/**
 * 初始化表单数据
 */
const initDataForm = () => {
  dataForm.value = {
    couponId: 0,
    couponName: '',
    subTitle: '',
    couponType: 1,
    reduceAmount: 0,
    couponDiscount: 0,
    cashCondition: 0,
    validTimeType: 1,
    getWay: 0,
    launchTime: null,
    startTime: null,
    endTime: null,
    afterReceiveDays: 0,
    validDays: 1,
    stocks: 1,
    suitableProdType: 0,
    limitNum: 1,
    putonStatus: 0,
    couponProds: []
  }
}
const getDataList = () => {
  http({
    url: http.adornUrl(`/platform/coupon/info/${dataForm.value.couponId}`),
    method: 'get',
    params: http.adornParams()
  })
    .then(({ data }) => {
      dataForm.value = data
      launchTimeValue.value = dataForm.value.launchTime ? dataForm.value.launchTime.substring(11, dataForm.value.launchTime.length - 3) : ''
      startTimeValue.value = dataForm.value.startTime ? dataForm.value.startTime.substring(11, dataForm.value.startTime.length - 3) : ''
      endTimeValue.value = dataForm.value.endTime ? dataForm.value.endTime.substring(11, dataForm.value.endTime.length - 3) : ''
      dataForm.value.launchTime = getParseTime(dataForm.value.launchTime, '{y}-{m}-{d}')
      dataForm.value.startTime = getParseTime(dataForm.value.startTime, '{y}-{m}-{d}')
      dataForm.value.endTime = getParseTime(dataForm.value.endTime, '{y}-{m}-{d}')
      putonStatus.value = dataForm.value.putonStatus
    })
}

/**
 * 检验库存输入
 */
const stocksCheck = () => {
  let maxNum = Math.round(dataForm.value.stocks)
  if (!maxNum) {
    maxNum = 1
  } else if (maxNum < 1) {
    maxNum = 1
  } else if (maxNum > 1000000000) {
    maxNum = 1000000000
  }
  dataForm.value.stocks = maxNum
}

/**
 * 检验限领张数输入
 */
const limitNumCheck = () => {
  let maxNum = Math.round(dataForm.value.limitNum)
  if (!maxNum) {
    maxNum = 1
  } else if (maxNum < 1) {
    maxNum = 1
  } else if (maxNum > 1000000000) {
    maxNum = 1000000000
  }
  dataForm.value.limitNum = maxNum
}

const prodsSelectRef = ref(null)
/**
 * 显示添加指定商品弹框
 */
const prodsSelectHandle = () => {
  prodsSelectVisible.value = true
  nextTick(() => {
    prodsSelectRef.value?.init(dataForm.value?.couponProds)
  })
}

/**
 * 删除指定商品
 * @param index
 */
const deleteProd = (index) => {
  dataForm.value.couponProds.splice(index, 1)
}

/**
 * 添加指定商品
 * @param prods
 */
const selectCouponProds = (prods) => {
  if (prods) {
    dataForm.value.couponProds = prods
  }
}

/**
 * 输入框的数据改变时，对值进行校验
 */
const checkNumber = (type) => {
  if (type === 1) {
    const reduceAmount = parseFloat(dataForm.value.reduceAmount)
    dataForm.value.reduceAmount = formatNumber(reduceAmount)
  }
  if (type === 2) {
    const coupDiscount = dataForm.value.couponDiscount
    // 如果小于零
    if (coupDiscount <= 0) {
      dataForm.value.couponDiscount = 0.1
    }
    if (coupDiscount >= 10) {
      // 如果折扣大于10
      dataForm.value.couponDiscount = 9.9
    }
  }
}

/**
 * 格式化输入的优惠券减免金额
 * @param number
 * @returns {number}
 */
const formatNumber = (number) => {
  number = parseFloat(number.toFixed(2))
  if (!number) {
    return
  }
  const maxNumber = 99999.99
  if (number >= maxNumber) {
    return maxNumber
  }
  if (number < 0.01) {
    return 0.01
  }
  return number
}

/**
 * 消费金额最低要求检验
 */
const cashConditionChange = () => {
  const caCondition = dataForm.value.cashCondition
  dataForm.value.cashCondition = caCondition <= 0 ? 0.01 : caCondition
  dataForm.value.cashCondition = caCondition > 9999999999999 ? 9999999999999 : caCondition
}

/**
 * 表单提交
 */
const onSubmit = () => {
  // 商品空选择校验
  if (dataForm.value.suitableProdType !== 0 && !dataForm.value.couponProds.length) {
    ElMessage({
      message: $t('marketing.pleaseSelectAProduct'),
      type: 'error',
      duration: 1500
    })
    return
  }
  if (errorTip.value) {
    ElMessage({
      message: $t('coupon.quantitssThan0'),
      type: 'error',
      duration: 1500
    })
    return
  }
  dataFormRef.value?.validate((valid) => {
    if (valid) {
      if (dataForm.value.putonStatus === 0) {
        if (Date.parse(dataForm.value.launchTime + ' ' + launchTimeValue.value + ':00') <= Date.now()) {
          ElMessage({
            message: $t('coupon.launchTimeTip'),
            type: 'error',
            duration: 1500
          })
          return
        } else if (dataForm.value.launchTime === null || launchTimeValue.value === null) {
          ElMessage({
            message: $t('coupon.launchTimeTip1'),
            type: 'error',
            duration: 1500
          })
          return
        }
      }
      const launchTime = dataForm.value.launchTime
      const startTime = dataForm.value.startTime
      const endTime = dataForm.value.endTime
      dataForm.value.launchTime = dataForm.value.launchTime && launchTimeValue.value ? dataForm.value.launchTime + ' ' + launchTimeValue.value + ':00' : ''
      if (dataForm.value.validTimeType !== 2) {
        dataForm.value.startTime = dataForm.value.startTime && startTimeValue.value ? dataForm.value.startTime + ' ' + startTimeValue.value + ':00' : ''
        dataForm.value.endTime = dataForm.value.endTime && endTimeValue.value ? dataForm.value.endTime + ' ' + endTimeValue.value + ':00' : ''
      } else {
        dataForm.value.startTime = null
        dataForm.value.endTime = null
      }
      if (dataForm.value.couponType === 1 && (parseFloat(dataForm.value.cashCondition) <= parseFloat(dataForm.value.reduceAmount))) {
        ElMessage.error($t('coupon.amounnCannotBe'))
        return false
      }
      if (isSubmit.value) {
        return false
      }
      isSubmit.value = true
      http({
        url: http.adornUrl('/platform/coupon'),
        method: dataForm.value.couponId ? 'put' : 'post',
        data: http.adornData({
          couponId: dataForm.value.couponId || undefined,
          couponName: dataForm.value.couponName,
          subTitle: dataForm.value.subTitle,
          couponType: dataForm.value.couponType,
          reduceAmount: parseFloat(dataForm.value.reduceAmount),
          couponDiscount: parseFloat(dataForm.value.couponDiscount),
          cashCondition: parseFloat(dataForm.value.cashCondition),
          validTimeType: dataForm.value.validTimeType,
          getWay: dataForm.value.getWay,
          launchTime: dataForm.value.putonStatus === 0 ? dataForm.value.launchTime : null,
          startTime: dataForm.value.startTime,
          endTime: dataForm.value.endTime,
          afterReceiveDays: dataForm.value.afterReceiveDays,
          validDays: dataForm.value.validDays,
          stocks: dataForm.value.stocks,
          suitableProdType: dataForm.value.suitableProdType,
          limitNum: dataForm.value.limitNum,
          putonStatus: dataForm.value.putonStatus,
          couponProds: dataForm.value.couponProds
        })
      })
        .then(() => {
          ElMessage({
            message: $t('publics.operation'),
            type: 'success',
            duration: 1500,
            onClose: () => {
              dataForm.value.couponProds = []
              emit('refreshDataList', page)
              visible.value = false
            }
          })
        })
        .catch(() => {
          isSubmit.value = false
        })
      dataForm.value.launchTime = launchTime
      dataForm.value.startTime = startTime
      dataForm.value.endTime = endTime
    }
  })
}
const beforeClose = (done) => {
  show.value = false
  done()
}
const handleValidate = (props) => {
  nextTick(() => {
    dataFormRef.value.validateField(props)
  })
}
</script>

<style lang="scss" scoped>
.component-coupon-add-or-update {
  :deep(.el-col) {
    width: 130px;
  }
}
.prod-line-height {
  line-height: 18px;
}
.delete-prod{
  display: flex;
  justify-content: flex-end;
}
.prod-text-left {
  margin-right: 10px;
}
:deep(.el-date-editor .el-input__suffix>.el-icon-circle-check),
:deep(.el-date-editor .el-input__suffix>.el-icon-circle-close) {
  display: none
}
:deep(.el-form-item__content .el-row) {
  width: 100%;
}
:deep(.asterisk-left .el-row > .el-col) {
  flex: 0 0 16.6%;
}
</style>
